<template>
    <div>
        <van-tabs v-model:active="active" animated>
            <van-tab title="全部">
                <van-card num="3" price="20.10" title="华为Mate60Pro"
                    thumb="https://ts3.tc.mm.bing.net/th?id=ORMS.571537a27fb14d85ac110ba4805cbad6&pid=Wdp&w=268&h=140&qlt=90&c=1&rs=1&dpr=1.5&p=0">
                    <template #footer>
                        <van-button size="mini">取消订单</van-button>
                        <van-button size="mini" @click="zf">立即支付</van-button>
                    </template>
                </van-card>

                <van-card num="3" price="20.10" title="华为Mate60Pro"
                    thumb="https://ts3.tc.mm.bing.net/th?id=ORMS.571537a27fb14d85ac110ba4805cbad6&pid=Wdp&w=268&h=140&qlt=90&c=1&rs=1&dpr=1.5&p=0">
                </van-card>

                <van-card num="3" price="20.10" title="华为Mate60Pro"
                    thumb="https://ts3.tc.mm.bing.net/th?id=ORMS.571537a27fb14d85ac110ba4805cbad6&pid=Wdp&w=268&h=140&qlt=90&c=1&rs=1&dpr=1.5&p=0">
                </van-card>

            </van-tab>
            <van-tab title="待付款">内容 2</van-tab>
            <van-tab title="代发货">内容 3</van-tab>
            <van-tab title="待收货">内容 4</van-tab>
            <van-tab title="已完成">内容 3</van-tab>
            <van-tab title="已发货">内容 4</van-tab>
        </van-tabs>
    </div>
</template>

<script setup>
import  {useRouter  } from 'vue-router'
const router =useRouter()
const zf=()=>{
    router.push('/index')
}
</script>

<style lang="scss" scoped></style>